﻿@using System.Web.Script.Serialization
@{
    ViewBag.Title = "StatusTaged";
}


<div class="container">
    <h2>StatusTaged</h2>


    <div class="statuses_list" data-bind="visible:Messages().length>0" style="display: none">

        <ul class="media-list">
            <!-- ko foreach: Messages-->
            <li class="media">
                <a class="pull-left" href="#">
                    <img data-bind="attr:{src: CustomerLogoUrl}" class="media-object" />
                </a>
                <div class="media-body ">
                    <h4 class="media-heading"></h4>

                    <div class="comment-content" style="float: left" data-bind="attr:{link:'/status/' +Id()},click:GoOnePageProduct">
                        <span data-bind="html:Text"></span>
                        <!-- ko if: IsProduct-->
                        <div>
                            <span data-bind="text:ProductStock"></span>
                            <span data-bind="text:ProductPrice"></span>
                        </div>
                        <!-- /ko -->

                        <!-- ko foreach: Pics-->
                        <div class="comment-pictures">
                            <img data-bind="attr:{src: PicUrl},click:ShowOriginalPic" />
                        </div>
                        <!-- /ko -->

                        <ul class="status-tagedit-list " style="border: 0px">
                            <!-- ko foreach: Tags-->
                            <li class="tagedit-listelement tagedit-listelement-old"><span data-bind="text:TagName"></span></li>
                            <!-- /ko -->
                        </ul>

                    </div>
                    <div class="operation">
                    </div>
                </div>
            </li>

            <!-- /ko -->
        </ul>

        @*<div class="row-fluid">
        <input type="button" value="More" data-bind="click:MoreStatus,visible:Messages().length>0" class="btn btn-default btn-block" />
    </div>*@
    </div>
</div>


@{
    var model = ViewBag.Model;
    var jsonStr = new HtmlString(new JavaScriptSerializer().Serialize(model));
}

@section scripts
{
    <script src="~/Scripts/statuses/Statuses.js"></script>
    <script src="~/Scripts/statuses/tags.js"></script>

    <script>

        var init = @jsonStr;


        function StatusTaggedModel() {
            
            var self = this;
            
            var tempMessages = $.isEmptyObject(init.StatusList) ? [] : $.map(init.StatusList, function(a) {
                var tempPics = $.isEmptyObject(a.StatusPictures) ? [] : $.map(a.StatusPictures, function(p) {
                    return new StatusPictureModel(p.PicId, p.PicUrl);
                });
                var productStock = a.ProductStatus == null ? "":a.ProductStatus.ProductStock;
                var productPrice = a.ProductStatus == null ? "": a.ProductStatus.ProductPrice;
                var productId= a.ProductStatus == null ? "": a.ProductStatus.ProductId;

                var tempTags= $.isEmptyObject(a.StatusTags) ? [] : $.map(a.StatusTags, function(p) {
                    return new TagModel(p.TagName, p.TagValue);
                });
                return new StatusListItemModel(a.Id, a.CreatedAt, a.Text, a.CustomerId, a.Deleted, a.CustomerName, a.CustomerLogoUrl, a.CustomerEmail, tempPics, a.IsProductStatus, productStock, productPrice, productId,
                                                tempTags);
            });
            self.Messages = ko.observableArray(tempMessages);
        }

        var vm = new StatusTaggedModel();
        ko.applyBindings(vm);
    </script>
}